<template>
  <div class="comment">
    <div class="comment-title">
      <div :style="{'background': color}" class="point"></div>
      <span class="title-name">{{titleName}}</span>
      <span class="title-des" :style="{'color': color}">{{des}}</span>
    </div>
    <div class="comment-content">
      <span class="content-des">{{comment}}</span>
      <!-- <a-divider style="height: 1px; margin: 0px" ></a-divider> -->
    </div>
  </div>
</template>

<script>
export default {
  props: {
    titleName: {
      type: String,
      default: "",
    },
    des: {
      type: String,
      default: "",
    },
    color: {
      type: String,
      default: "#000",
    },
    comment: {
      type: String,
      default: "aaaaa",
    },
  },
};
</script>

<style lang="stylus" scoped>
.comment
  padding 8px 0px 0px 0px
  display flex
  flex-direction column
  justify-content center
  .point
    width 12px
    height 12px
    border-radius 2px
  .comment-title
    padding 20px 0px 0px 0px
    color #000
    font-size 18px
    display flex
    align-items center
    .title-name
      margin-left 12px
    .title-des
      margin-left 5px
      font-family '微软雅黑'
.content-des
    padding-left 24px
    font-size 14px
    line-height 56px
    color #666666
</style>